(function () {
    $(".goods_top").load("http://localhost:81/html/public.html .top_wrap", function () {
        if ($.cookie("loadsuccess")) {
            $(".top_right").find("li").first().html("欢迎您" + $.cookie('loadsuccess') + "  <em>注销</em>")
            $(".top_right").find("em").css({
                cursor: "pointer",
                color: "red"
            })
            $(".top_right").find("em").on("click", function () {
                $.cookie("loadsuccess", null)
                window.location.reload()
            })
        } else {
            var res = confirm("需要先登录,即将跳转到登录界面");
            if (res == true) {
                window.location.href = "http://localhost:81/html/load.html"

            } else {
                window.history.back()
            }

        }
    });
    // $(".goods_header").load(
    //     "http://localhost:81/html/public.html .logo_wrap"
    // );
    // $(".goods_nav").load(
    //     "http://localhost:81/html/public.html .nav_wrap",
    //     function () {
    //         (function () {
    //             $(".nav_menu").css({
    //                 display: "none",
    //             });

    //             $(".nav_first_title").hover(
    //                 function () {
    //                     $(".nav_menu").css({
    //                         display: "block",
    //                     });
    //                 },
    //                 function () {
    //                     $(".nav_menu").css({
    //                         display: "none",
    //                     });
    //                 }
    //             );

    //             $(".nav_li").hover(
    //                 function () {
    //                     $(this)
    //                         .css({
    //                             background: "black",
    //                         })
    //                         .find(".menu")
    //                         .css({
    //                             display: "block",
    //                         });
    //                 },
    //                 function () {
    //                     $(this)
    //                         .css({
    //                             background: "",
    //                         })
    //                         .find(".menu")
    //                         .css({
    //                             display: "none",
    //                         });
    //                 }
    //             );
    //         })();
    //         (function () {
    //             $(".nav ul")
    //                 .children("li")
    //                 .not($(".nav_first_title"))
    //                 .hover(
    //                     function () {
    //                         $(this)
    //                             .css({
    //                                 background: "#f03a58",
    //                                 color: "#fff",
    //                             })
    //                             .children("a")
    //                             .css({
    //                                 color: "#fff",
    //                             });
    //                     },
    //                     function () {
    //                         $(this)
    //                             .css({
    //                                 background: "#fff",
    //                                 color: "#000",
    //                             })
    //                             .children("a")
    //                             .css({
    //                                 color: "#000",
    //                             });
    //                     }
    //                 );
    //         })();
    //     }
    // );
    // $(".goods_footer").load(
    //     "http://localhost:81/html/public.html .footer_wrap"
    // );
    // $(".goods__bottom").load(
    //     "http://localhost:81/html/public.html .bottom_wrap"
    // );

    //模块化
    require(["../js/rendermodules.js"],function(res){
        res("goods")
      })
})();
(function () {
    class Cart {
        constructor() {
            this.obox = document.getElementById("cart_render");
            this.jiesuan = document.querySelector(".jiesuann");
            this.time = 0
            this.load();
            this.addEvent();
        }
        load() {
            this.getDate();
        }

        getDate() {
            ajaxEX({
                url: "http://localhost:81/data/goods.json",
                success: (res) => {
                    this.time = JSON.parse($.cookie("goodsMsg"))[0].time;
                    this.msg = JSON.parse(res).arr[this.time].inner.msg;

                    this.compare();
                },
            });
        }

        //渲染
        compare() {
            var str = "";
            var count = 0;
            var total = 0;
            this.goodsMsg = $.cookie("goodsMsg") ?
                JSON.parse($.cookie("goodsMsg")) : [];
            for (let i = 0; i < this.goodsMsg.length; i++) {
                for (let j = 0; j < this.msg.length; j++) {
                    if (this.goodsMsg[i].id === this.msg[j].Id) {
                        str += `<tr class="goods">
     <td>
       <input type="checkbox" class="one" data-index="${this.goodsMsg[i].id}"/>
     </td>
     <td>
       <div class="goods_item">
         <a href="##">
           <img src="${this.msg[j].goodsmsg}" alt="" />
         </a>
         <div class="info">
           <p class="title">
             <a href="##">${this.msg[j].goods}</a>
           </p>
           <p>品牌:${this.msg[j].logo}</p>
           <p>型号:XXX</p>
           <p>订货号:XXXX</p>
         </div>
       </div>
     </td>
     <td class="price">
       <p>
         <strong>${this.msg[j].price2}/套</strong>
       </p>
     </td>
     <td>
       <div class="count_handle">
         <input type="number" value="${
                       this.goodsMsg[i].num }" data-id="${i}"/>
       </div>
     </td>
     <td class="price2">
       <strong>${
                    this.msg[j].price2 * this.goodsMsg[i].num}元</strong>
     </td>
     <td><a href="##" class="delee" data-id="${i}"> 删除 </a></td>
   </tr>`


                        count += parseInt(this.goodsMsg[i].num);
                        total += this.msg[j].price2 * this.goodsMsg[i].num;

                        this.obox.innerHTML = str;
                    }
                }
            }
            this.jiesuan.innerHTML = `<div class="zongjia">
            <button>选中删除</button>
            <p>总数量：${count}个</p>
            <p>
              总金额（不含运费）：
              <strong>${total}</strong>
            </p>
          </div>`
            if (this.goodsMsg.length < 1) {
                this.obox.innerHTML = `
                <tr>
                <td class="null_context" colspan="6">
                   <div>购物车还是空的，去挑几件好货吧~
                   <a href="http://localhost:81/html/index.html">去逛逛</a>
                   </div>
                </td>
                </tr>
                `;
            }
            this.checkon();
        }

        addEvent() {
            let that = this;

            this.obox.addEventListener(
                "click",
                function (eve) {
                    let e = eve || window.event;
                    let tar = e.target || e.srcElement;
                    if (tar.nodeName === "A") {
                        that.delindex = tar.getAttribute("data-id");
                        that.goodsMsg.splice(that.delindex, 1);
                        that.sendMsg = JSON.stringify(that.goodsMsg);
                        $.cookie("goodsMsg", that.sendMsg, {
                            expires: 7
                        });
                        that.compare();
                    }
                },
                false
            );

            this.obox.addEventListener(
                "input",
                function (eve) {
                    let e = eve || window.event;
                    let tar = e.target || e.srcElement;
                    if (tar.nodeName === "INPUT" && tar.type === "number") {
                        that.inputindex = tar.getAttribute("data-id");
                        that.goodsMsg[that.inputindex].num = tar.value;
                        that.sendMsg = JSON.stringify(that.goodsMsg);
                        $.cookie("goodsMsg", that.sendMsg, {
                            expires: 7
                        });
                    }
                },
                false
            );

            this.obox.addEventListener(
                "change",
                function (eve) {
                    let e = eve || window.event;
                    let tar = e.target || e.srcElement;
                    if (tar.nodeName === "INPUT" && tar.type === "number") {
                        that.compare();
                    }
                },
                false
            );
        }

        checkon() {
            let that = this;
            this.aone = document.querySelectorAll(".one");
            this.oall = document.querySelector("#all");
            this.odel = document.querySelector(".jiesuann button");

            this.oall.addEventListener(
                "change",
                function () {
                    if (this.checked === true) {
                        for (let i = 0; i < that.aone.length; i++) {
                            that.aone[i].checked = true;
                        }
                    } else {
                        for (let i = 0; i < that.aone.length; i++) {
                            that.aone[i].checked = false;
                        }
                    }
                },
                false
            );

            for (let i = 0; i < that.aone.length; i++) {
                that.aone[i].onchange = function () {
                    that.aone = Array.from(that.aone);
                    var a = that.aone.every(function (val) {
                        if (val.checked === true) {
                            return true;
                        }
                    });
                    if (a) {
                        that.oall.checked = true;
                    } else {
                        that.oall.checked = false;
                    }
                };
            }

            this.odel.addEventListener(
                "click",
                function () {
                    that.aone = Array.from(that.aone);
                    let arr = that.aone.filter((val) => {
                        return val.checked === true;
                    });

                    arr = arr.map((val) => {
                        return val.getAttribute("data-index");
                    });
                    for (let i = 0; i < arr.length; i++) {
                        that.goodsMsg = that.goodsMsg.filter((val) => {
                            if (val.id === arr[i]) {
                                return false;
                            } else {
                                return true;
                            }
                        });
                    }
                    //最后把goodsMsg发送到cookie，进行渲染
                    that.sendMsg = JSON.stringify(that.goodsMsg);
                    $.cookie("goodsMsg", that.sendMsg, {
                        expires: 7
                    });
                    that.compare();
                },
                false
            );
        }
    }
    new Cart();
})();